<div th:fragment="headnav">
    <li><a th:href="@{/user/toIndex}">首页</a></li>
    <li><a th:href="@{/user/toArticle}">博客</a></li>
    <li><a th:href="@{/message.html}">留言</a></li>
    <li><a th:href="@{/user/toLink}">友链</a></li>
    <li th:if="${session.userInfo == null}"><a th:href="@{/login.html}">登录</a></li>
    <li th:if="${session.userInfo != null}">
        <a th:href="'javascript: logout()'">注销</a>
    </li>
    <li th:if="${ session.userInfo != null and (session.userInfo.getRole() eq 'admin' or session.userInfo.getRole() eq 'root')}">
        <a th:href="@{/toAdminIndex}">管理员页面</a></li>
    <li th:if="${session.userInfo != null}">
        <a th:href="'javascript: setting()'"><img id="headImg" th:src="@{/file/getHeadImg}"
                                                  class="layui-nav-img">
            <span id="nickname" th:text="${session.userInfo.getNickname()}"></span>
        </a>
    </li>
</div>

<div th:fragment="commonJs">
    <script>
        window.setting = function () {
            layer.open({
                type: 2,
                title: '修改个人信息',
                shade: 0.1,
                area: ['1000px', '550px'],
                content: basePath + '/user-setting.html'
            });
        }
        window.refresh = function (nickname) {
            $('#headImg').attr('src', basePath + '/file/getHeadImg?id=' + Math.random());
            console.log("我是refresh"+nickname)
            $('#nickname').text(nickname);
        }

        function logout() {
            //询问框
            layer.confirm('真的要退出登录吗？', {
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: basePath + '/user/logout',
                    success: function (result) {
                        let jsonData = JSON.parse(result);
                        if (jsonData.code == 1) {
                            //成功
                            layui.layer.msg(jsonData.msg, {icon: 1});
                            window.location = basePath + '/user/toArticle';
                        } else {
                            //失败
                            layer.msg(jsonData.msg, {icon: 2});
                        }
                    },
                    error: function (arg) {
                        layer.msg(arg);
                    }
                })
            }, function () {
                layer.msg('取消退出登录', {
                    time: 1000, //1s后自动关闭
                });

            });

        }
    </script>
</div>
<div th:fragment="footer">
    <footer class="grid-footer">
        <div class="footer-fixed">
            <div class="copyright">
                <div class="info">
                    <div class="contact">
                        <a href="https://github.com/henu77" class="github" target="_blank"><i class="fa fa-github"></i></a>
                        <a href="https://wpa.qq.com/msgrd?v=3&uin=1289596706&site=qq&menu=yes" class="qq" target="_blank"
                           title="1289596706"><i class="fa fa-qq"></i></a>
                        <a href="https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=1289596706@qq.com"
                           class="email" target="_blank" title="1289596706@qq.com"><i class="fa fa-envelope"></i></a>
                        <a href="javascript:void(0)" class="weixin"><i id="wechartQR" class="fa fa-weixin"></i></a>
                    </div>
                    <p class="mt05">
                        Copyright &copy; 2021-2021 MyBlog All Rights Reserved V.0.0.1
                    </p>
                </div>
            </div>
        </div>
    </footer>
</div>
<div th:fragment="showWeChartQR">
    <script>
        let layerQR;
        $('#wechartQR').mouseover(function () {
            let temp = '<img id="wechartQRImg" src="/image/wechartQR.png" style="width: 120px;height: 120px"/>';
            layerQR = layui.layer.tips(temp, '#wechartQR', {
                anim: 5,
                tips: [3, '#ffffff'],
            });
        });
        $('#wechartQR').mouseout(function () {
            layui.layer.close(layerQR);
        });
    </script>
</div>